<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <link rel="stylesheet" href="../../css/layui.css" media="all">
</head>
<body style="padding-left: 20px;padding-right:20px;">
<br/>

<div class="layui-row" id="updateTest" style="display:none;" >
    <div class="layui-col-md10">
        <form class="layui-form layui-from-pane" lay-filter="edit" action="" style="margin-top:20px" >
            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">用户名</label>
                    <div class="layui-input-inline">
                        <input type="text" name="nickName" lay-verify="required" placeholder="请输入" autocomplete="off" class="layui-input">
                    </div>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">密码</label>
                    <div class="layui-input-inline">
                        <input type="text" name="pwd" lay-affix="eye" lay-verify="required" placeholder="请输入" autocomplete="off" class="layui-input">
                    </div>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">手机号</label>
                    <div class="layui-input-inline">
                        <input type="text" name="tel" lay-verify="required|phone" placeholder="请输入" autocomplete="off" class="layui-input">
                    </div>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">邮箱</label>
                    <div class="layui-input-inline">
                        <input type="text" name="email" lay-verify="email" placeholder="请输入" autocomplete="off" class="layui-input">
                    </div>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">权限</label>
                    <div class="layui-input-inline">
                        <input type="text" name="state" lay-verify="required" placeholder="请输入" autocomplete="off" class="layui-input">
                    </div>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button type="submit" class="layui-btn" id="add_btn" lay-submit lay-filter="demo11">提交修改</button>
                    <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                </div>
            </div>
        </form>
    </div>
</div>



    <div class="demoTable" id="admin-find" >
        <!-- <label class="layui-form-label" style="">领养时间</label> -->
        用户名
        <div class="layui-input-inline">
            <input type="text" name="nickName" lay-verify="required" placeholder="请输入" autocomplete="off"
                   class="layui-input">
        </div>
        <button type="button" class="layui-btn" id="do_search">查询</button>

    <button type="button" class="layui-btn" id="do_add" onclick="add()" style="float: right;">
        <i class="layui-icon layui-icon-addition"></i>
        新增
    </button>
    </div>

<br/>
<table class="layui-hide" id="test" lay-filter="test"></table>
<script type="text/html" id="barDemo">
    <div class="layui-clear-space">
        <button type="button" class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit">
            <i class="layui-icon layui-icon-edit"></i>
            修改
        </button>
        <button type="button" class="layui-btn layui-btn-danger layui-btn-xs" lay-event="delete">
            <i class="layui-icon layui-icon-delete"></i>
            删除
        </button>
    </div>
</script>

</body>
<script src="../../js/jquery-3.4.1.min.js"></script>
<script type="text/javascript" src="../../js/layui.js"></script>
<script>
    layui.use(['table','form'],function(){
        var table=layui.table;
        var form=layui.form;
        table.render({
            elem:'#test',
            url:'../../admin?op=findPage',
            title:'管理员信息表',
            celMinWidth:120,
            id:'test',
            page:true,//分类工具类
            page:{limits:[3,5,7]},//自定义分页的条数
            cols:[[
                {type:'checkbox',fixed:'center'},
                {field:'aid',title:'编号',fixed:'center',unresize:true,sort:true,align:'center'},
                {field:'nickName',title:'用户名',fixed:'center',align:'center'},
                {field:'tel',title:'电话',fixed:'center',align:'center'},
                {field:'email',title:'邮箱',fixed:'center',align:'center'},
                {field:'state',title:'权限',fixed:'center',align:'center',templet:function(d){
                    if (d.state==1){
                        return "超级管理员";
                    }else if (d.state==0){
                        return "管理员";
                    }
                    }},
                {field:'aa',title:'操作',templet:'#barDemo'}
            ]]
        });


        table.on('tool',function(obj){
            var data =obj.data;
            console.log(obj);
            if(obj.event =='edit'){
                layer.open({
                    //layer提供了5种层类型。可传入的值有：0（信息框，默认）1（页面层）2（iframe层）3（加载层）4（tips层）
                    type: 1,
                    title: "修改管理员信息",
                    area: ['50%', '90%'],
                    content: $("#updateTest"),//引用的弹出层的页面层的方式加载修改界面表单

                    success: function (msg) {
                        console.log(msg);

                        //表单数据回显
                        form.val("edit",data);
                    },

                });
                setAdminValue(obj,data);

            }else if(obj.event=='delete'){
                layer.confirm('数据一旦删除将不能恢复，您确定删除吗？',{icon:3,title:'确认'},function(index){
                    var aid=data.aid;
                    $.ajax({
                        url: '../../admin?op=del',
                        type: "POST",
                        data: {aid: aid},
                        success: function (msg) {
                            console.log(msg);
                            if (msg == "ok") {
                                layer.msg('删除成功!',function() {time:2000})
                                table.reload('test',{  //表格重载，刷新数据 test是数据表格的id
                                    url:'../../admin?op=findPage',
                                    page: {
                                        curr:1
                                    }
                                });
                            } else if (msg=="state error"){
                                layer.msg("删除失败,你的权限不足，请联系超级管理员", function() {time:2000});
                            }else {
                                    layer.msg("删除失败");
                            }
                        }
                    });
                });
            }
        })
        // 监听关闭按钮的点击事件
        $('.close-btn').on('click', function() {
            $('#test').addClass('layui-hide');
        });
                $('#do_search').on('click', function () {
                    // 搜索条件
                    var name = $('#admin-find input[name="nickName"]').val();
                    console.log(name);
                    table.reload('test', {
                        method: 'post', where: {
                            nickName: name
                        }
                        , page: {
                            curr: 1
                        }
                    });


                });


        function setAdminValue(obj,data) {
            form.on('submit(demo11)', function (massage) {
                console.log(data.nickName);
                console.log(massage.field.nickName);
                console.log(data.aid);
                $.ajax({
                    url: '../../admin?op=update',
                    type: 'POST',
                    data: {
                        aid:data.aid,
                        nickName: massage.field.nickName,
                        pwd: massage.field.pwd,
                        tel: massage.field.tel,
                        email: massage.field.email,
                        state :massage.field.state
                    },
                    success: function (msg) {
                        console.log(msg);
                    //     if (msg == "ok") {
                    //         layer.msg('删除成功!',function() {time:2000})
                    //         table.reload('test',{  //表格重载，刷新数据 test是数据表格的id
                    //             url:'../../admin?op=findPage',
                    //             page: {
                    //                 curr:1
                    //             }
                    //         });
                    //     } else if (msg=="state error"){
                    //         layer.msg("删除失败,你的权限不足，请联系超级管理员", function() {time:2000});
                    //     }else {
                    //         layer.msg("删除失败");
                    //     }
                    }
                });
            });
            }
        });



    function add(){
        layer.open({
            title: '新增管理员',
            type: 2,
            area: ['40%','80%'],
            content:'adminAdd.html' //跳转到弹出页面
            // content: '<div style="padding: 16px;">自定义表单元素</div>'
        });
    }





</script>
</html>